"use client";

import React from "react";
import { useTheme } from "next-themes";
import { RiMoonFill, RiSunFill } from "react-icons/ri";

export default function ThemeToggle() {
  const { setTheme, theme } = useTheme();

  const toggleTheme = (v: string) => {
    setTheme(v);
  };

  return (
    <div className={"cursor-pointer"}>
      {theme === "light" ? (
        <RiMoonFill size={18} onClick={() => toggleTheme("dark")} />
      ) : (
        <RiSunFill size={18} onClick={() => toggleTheme("light")} />
      )}
    </div>
  );
}
